<template>
  <div class="panel-tab__content">
    <avue-form :option="conditionOption" v-model="flowConditionForm"></avue-form>

  </div>
</template>

<script>
import flowConditionOption from "./flowConditionOption";

export default {
  name: 'FlowCondition',
  props: {
    elementId: String,
  },
  computed: {
    conditionOption() {
      return flowConditionOption.getOption(this.formChange)
    }
  },
  watch: {
    elementId: {
      immediate: true,
      handler() {
        this.$nextTick(() => this.resetFlowCondition());
      }
    }
  },
  data() {
    return {
      flowConditionForm: {}
    };
  },

  methods: {
    resetFlowCondition() {
      this.bpmnElement = window.bpmnInstances.bpmnElement;

      this.bpmnElementSource = this.bpmnElement.source;
      this.bpmnElementSourceRef = this.bpmnElement.businessObject.sourceRef;
      if (this.bpmnElementSourceRef && this.bpmnElementSourceRef.default && this.bpmnElementSourceRef.default.id === this.bpmnElement.id) {
        // 默认
        this.flowConditionForm = {type: 'default'};
      } else if (!this.bpmnElement.businessObject.conditionExpression) {
        // 普通
        this.flowConditionForm = {type: 'normal'};
      } else {
        // 带条件
        const conditionExpression = this.bpmnElement.businessObject.conditionExpression;
        this.flowConditionForm = {...conditionExpression, type: 'condition'};
        // resource 可直接标识 是否是外部资源脚本
        if (this.flowConditionForm.resource) {
          this.flowConditionForm['conditionType'] = 'script'
          this.flowConditionForm['scriptType'] = 'externalScript'
          return;
        }
        if (conditionExpression.language) {
          this.flowConditionForm['conditionType'] = 'script'
          this.flowConditionForm['scriptType'] = 'inlineScript'
          return;
        }
        this.flowConditionForm['conditionType'] = 'expression'
      }
    },
    formChange() {

      this.updateFlowType()
      this.updateFlowCondition();
    },
    updateFlowType(flowType) {
      // 正常条件类
      if (flowType === 'condition') {
        this.flowConditionRef = window.bpmnInstances.moddle.create('bpmn:FormalExpression');
        window.bpmnInstances.modeling.updateProperties(this.bpmnElement, {
          conditionExpression: this.flowConditionRef
        });
        return;
      }
      // 默认路径
      if (flowType === 'default') {
        window.bpmnInstances.modeling.updateProperties(this.bpmnElement, {
          conditionExpression: null
        });
        window.bpmnInstances.modeling.updateProperties(this.bpmnElementSource, {
          default: this.bpmnElement
        });
        return;
      }
      // 正常路径，如果来源节点的默认路径是当前连线时，清除父元素的默认路径配置
      if (this.bpmnElementSourceRef.default && this.bpmnElementSourceRef.default.id === this.bpmnElement.id) {
        window.bpmnInstances.modeling.updateProperties(this.bpmnElementSource, {
          default: null
        });
      }
      window.bpmnInstances.modeling.updateProperties(this.bpmnElement, {
        conditionExpression: null
      });
    },
    updateFlowCondition() {

      const {conditionType, scriptType, body, resource, language} = this.flowConditionForm;
      let condition;
      if (conditionType === 'expression') {
        condition = window.bpmnInstances.moddle.create('bpmn:FormalExpression', {body});
      } else {
        if (scriptType === 'inlineScript') {
          condition = window.bpmnInstances.moddle.create('bpmn:FormalExpression', {body, language});
          this.flowConditionForm['resource'] = ''
        } else {
          this.flowConditionForm['body'] = ''
          condition = window.bpmnInstances.moddle.create('bpmn:FormalExpression', {resource, language});
        }
      }
      window.bpmnInstances.modeling.updateProperties(this.bpmnElement, {conditionExpression: condition});
    }
  },
  beforeUnmount() {
    this.bpmnElement = null;
    this.bpmnElementSource = null;
    this.bpmnElementSourceRef = null;
  }
};
</script>
